<section class="content-header" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
         xmlns:th="http://www.thymeleaf.org">
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
        <li><a href="#">库存服务</a></li>
        <li class="active">库存详情</li>
    </ol>
</section>
<!-- Main content -->
<section class="content">
    <div class="jax-box">
        <form id="formSearch" class="form-horizontal form-search">
            <div class="form-group">
                <div class="col-md-4 col-sm-6">
                    <label class="control-label  col-xs-4" for="stk-status">状态:</label>
                    <div class="col-xs-8">
<!--                        <input type="text" class="form-control" id="stk-Memo">-->
                        <select name="stkStatus" id="stk-status" class="form-control">
                            <option value="1">正常状态</option>
                            <option value="0">终止状态</option>
                            <option value="">全部</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6">
                    <label class="control-label  col-xs-4" for="stk-Prod-Name">产品名称:</label>
                    <div class="col-xs-8">
                        <input type="text" class="form-control" id="stk-Prod-Name">
                    </div>
                </div>
                <shiro:hasPermission name="proStorage:list">
                    <div class="col-md-1 col-sm-6 " style="text-align:left;">
                        <button type="button" id="btn_query" class="btn btn-info">查询</button>
                    </div>
                </shiro:hasPermission>
            </div>
        </form>
    </div>
    <div class="jax-box jax-box-table">
        <div id="toolbar" class="btn-group">
            <button id="btn_add" type="button" class="btn btn-primary" data-toggle="modal" data-target="#userModal">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
            <button id="btn_batch_delete" type="button" class="btn btn-danger">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>批量删除
            </button>

        </div>
        <table id="table"></table>
    </div>
</section>
<!-- 编辑信息模态框-->
<div id="editProDuctModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">产品信息</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" id="proStorageDetailForm">
                    <div class="box-body">
                        <div class="form-group" hidden>
                            <label class="col-sm-3 control-label" for="stkId">id :</label>
                            <div class="col-sm-8">
                                <input name="stkId" id="stkId" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stkProdCode">产品编号 :</label>
                            <div class="col-sm-8">
                                <input name="stkProdCode" id="stkProdCode" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stkProdName">产品名称 :</label>
                            <div class="col-sm-8">
                                <input name="stkProdName" id="stkProdName" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stkWarehouse">仓库 :</label>
                            <div class="col-sm-8">
                                <input name="stkWarehouse" id="stkWarehouse" class="form-control" min="=1" readonly>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stkWare">单位 :</label>
                            <div class="col-sm-8">
                                <input name="stkWare" id="stkWare" class="form-control" min="=1" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stkCount">库存 :</label>
                            <div class="col-sm-8">
                                <input name="stkCount" id="stkCount" class="form-control" min="1" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stkMemo">产品备注 :</label>
                            <div class="col-sm-8">
                                <input name="stkMemo" id="stkMemo" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group" hidden>
                            <label class="col-sm-3 control-label" for="stkStatus">产品状态 :</label>
                            <div class="col-sm-8">
<!--                                <input name="stkStatus" id="stkStatus" class="form-control" readonly>-->
                                <select name="stkStatus" id="stkStatus" class="form-control" min="=1">
                                    <option value="1">正常</option>
                                    <option value="0">异常</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <!-- /.box-body -->
                    <div class="box-footer">
                        <div class="pull-right">
                            <button type="button" id="saveEditProDuct" class="btn btn-info">确定</button>
                            <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
                        </div>
                    </div>
                    <!-- /.box-footer -->
                </form>
            </div>
        </div>
    </div>
</div>
<!-- 编辑库存模态框 -->
<div id="setStockModal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">设置库存、仓库</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" id="setStockForm">
                    <div class="box-body">
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stk-Prod-Code">产品编号 :</label>
                            <div class="col-sm-8">
                                <input name="stkProdCode" id="stk-Prod-Code" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stk-Warehouse">仓库 :</label>
                            <div class="col-sm-8">
                                <input name="stkWarehouse" id="stk-Warehouse" class="form-control" min="=1">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label" for="stk-Count">库存 :</label>
                            <div class="col-sm-8">
                                <input name="stkCount" id="stk-Count" class="form-control" require="必填项">
                            </div>
                        </div>
                    </div>
                    <!-- /.box-body -->
                    <div class="box-footer">
                        <div class="pull-right">
                            <button type="button" id="saveSetStock" class="btn btn-info">确定</button>
                            <button type="button" data-dismiss="modal" class="btn btn-default">取消</button>
                        </div>
                    </div>
                    <!-- /.box-footer -->
                </form>
            </div>
        </div>
    </div>
</div>
<script>
    var editFlag = "[[${@perms.hasPerm('proStorage:edit')}]]";
    var deleteFlag = "[[${@perms.hasPerm('proStorage:delete')}]]";
    // var assignRoleFlag="[[${@perms.hasPerm('customer:assignRole')}]]";
    var proStorageIdsStr;//批量用户id
    var roleIdStr;//分配的角色
    var selectRoleIds;
    var customerIdChecked;
    var loadRoleCount = 0;
    var columns = [
        {checkbox: true},
        {
            field: 'stkProdCode',
            title: '产品编号',
            align: "center"
        }, {
            field: 'stkProdName',
            title: '产品名称',
            align: "center"
        }, {
            field: 'stkWarehouse',
            title: '仓库',
            align: "center"
        }, {
            field: 'stkWare',
            title: '货位',
            align: "center"
        }, {
            field: 'stkCount',
            title: '库存',
            align: "center"
        }, {
            field: 'stkMemo',
            title: '备注',
            align: "center"
        }, {
            field: 'stkStatus',
            title: '状态',
            align: "center",
            formatter: function (value, row, index) {
                if(row.stkStatus==1){
                    return "<p style='color: green'>正常</p>";
                }else{
                    return "<p style='color: red'>有异常</p>";
                }
            }
        }, {
            field: 'operation',
            title: '操作',
            align: "center",
            formatter: function (value, row, index) {
                if(row.stkStatus==1){
                    var edit = editFlag == "true" ? "<a class='table-btn table-btn-info' href='javascript:void(0)' onclick='editStorage(" + JSON.stringify(row) + ")'>产品信息</a>" : '';
                    var changeStock = "<a class='table-btn table-btn-info'  href='javascript:void(0)' onclick='changeStock(" + row.stkProdCode +","+ row.stkCount +",\""+row.stkWarehouse+"\")'>更改库存</a>";
                    return edit + changeStock;
                }else{
                    return "<p style='color: red'>禁止操作</p>";
                }

            }
        }];
    var options = {
        id: "#table",
        url: '/proStorage/list',
        columns: columns,
        toolbar: '#toolbar',
        showRefresh: true,
        queryParams: queryParams
    }
    Core.initTable(options);
    //查询用户参数
    function queryParams(params) {
        var temp = { //这里的键的名字和控制器的变量名必须一致，这边改动，控制器也需要改成一样的
            limit: params.limit, //页面大小
            offset: params.offset, //页码
            stkStatus: $("#stk-status").val(),
            stkProdName: $("#stk-Prod-Name").val(),
        };
        return temp;
    }
    //编辑信息模态框参数
    function editStorage(val) {
        console.log("编辑信息");
        $("#stkId").val(val.stkId);
        $("#stkProdCode").val(val.stkProdCode);
        $("#stkProdName").val(val.stkProdName);
        $("#stkWarehouse").val(val.stkWarehouse);
        $("#stkWare").val(val.stkWare);
        $("#stkCount").val(val.stkCount);
        $("#stkMemo").val(val.stkMemo);
        $("#stkStatus").val(val.stkStatus);
        $("#editProDuctModal").modal("show");
    }
    //编辑库存模态框参数
    function changeStock(code,count,stkWarehouse) {
        $("#stk-Prod-Code").val(code);
        $("#stk-Warehouse").val(stkWarehouse);
        $("#stk-Count").val(count);
        $("#setStockModal").modal("show");
    }
    //删除
    function deleteUser(stkId) {
        Core.confirm("确定删除该商品？", function () {
            Core.postAjax("/proStorage/delete", {"stkId": stkId}, function (data) {
                if (data.status == 200) {
                    Core.refreshTable("#table");
                    layer.msg(data.msg)
                }else{
                    layer.msg(data.msg);
                }
            }, "get")
        })
    }
    $(function () {
        //保存产品编辑
        $("#saveEditProDuct").click(function () {
            if (doValidForm("#proStorageDetailForm")) {
                var serialize = $("#proStorageDetailForm").serialize();
                Core.postAjax("/proStorage/edit", serialize, function (data) {
                    if (data.status == 200) {
                        Core.refreshTable("#table");
                        $("#editProDuctModal").modal("hide");
                        layer.msg(data.msg);
                    } else {
                        layer.msg(data.msg);
                    }
                })
            }
        })
        //保存库存设置
        $("#saveSetStock").click(function(){
            var serialize = $("#setStockForm").serialize();
            Core.postAjax("/proStorage/edit", serialize, function (data) {
                if (data.status == 200) {
                    layer.msg(data.msg);
                    $("#setStockModal").modal("hide");
                    Core.refreshTable("#table");
                } else {
                    layer.msg(data.msg);
                }
            })
        })
        //查询
        $("#btn_query").click(function () {
            Core.refreshTable("#table");
        });
        //增加
        $("#btn_add").click(function () {
            Core.clearError("#proStorageForm");
        });
        //批量删除
        $("#btn_batch_delete").click(function () {
            var checkedRows = Core.selectMutiData("#table");
            if (checkedRows) {
                Core.confirm("确定删除选中的" + checkedRows.length + "条记录？", function () {
                    proStorageIdsStr = "";
                    $.each(checkedRows, function (i, item) {
                        proStorageIdsStr += (item.stkId + ",");
                    })
                    proStorageIdsStr = proStorageIdsStr.substring(0, proStorageIdsStr.length - 1);
                    Core.postAjax("/proStorage/batch/delete", {"proStorageIdsStr": proStorageIdsStr}, function (data) {
                        if (data.status == 200) {
                            Core.refreshTable("#table");
                        }
                        layer.msg(data.msg);
                    }, "get")
                })
            }
        });
    });
</script>